<template>
  <div class="container">
    <div class="row">
        <ForumHeader/>
        <div style="margin: 80px;"></div>
        <el-form :label-position="labelPosition" label-width="80px" :model="articleContent" class="col-md-6 mx-auto">
        <el-form-item label="帖子名">
            <el-input v-model="articleContent.articlename"  maxlength="10" show-word-limit></el-input>
        </el-form-item>
        <el-form-item label="发帖人">
            <el-input v-model="articleContent.articleuser"  maxlength="10" show-word-limit></el-input>
        </el-form-item>
        <el-form-item label="帖子内容">
            <el-input
            type="textarea"
            :rows="2"
            placeholder="请输入内容"
            maxlength="30"
            show-word-limit
            v-model="articleContent.articlecontent">
            </el-input>
        </el-form-item>
        <el-form-item label="发帖时间">
            <el-input v-model="articleContent.articletime"  maxlength="10" show-word-limit></el-input>
        </el-form-item>
        </el-form>
    </div>
  </div>
</template>

<script>
import ForumHeader from './ForumHeader.vue';
export default {
    name:"ForumDetails",
    components:{ForumHeader},
    data() {
        return {
            labelPosition: 'left',
            articleContent:{
                articlename:'',
                articleuser:'',
                articlecontent:'',
                articletime:''
            }
        }
    },
    mounted(){
        console.log(this.$route.params.articleId)
        // let articleid = this.$route.params.articleId
        // console.log('传参成功',articleid)
        this.getSingleArticle();
    },
    methods:{
        getSingleArticle(){
            let articleid = this.$route.params.articleId
            this.axios.get('http://localhost:8001/article/getarticleByID?articleid='+articleid).then((resp)=>{
                let data = resp.data;
                this.articleContent.articlename = data.content.articlename;
                this.articleContent.articleuser = data.content.articleuser;
                this.articleContent.articlecontent = data.content.articlecontent;
                this.articleContent.articletime = data.content.articletime;
                if(data.success){
                    this.$message({
                        message:'恭喜你,查看成功',
                        type:'success',
                    });
                }
            })
        }
    }
}
</script>

<style>

</style>